<template>
  <div>
    <div class="beachTable">
      <el-table
        style="width: 100%"
        border
        :data="list"
        text-align="center"
        :header-cell-style="{ 'text-align': 'center' }"
        :cell-style="{ 'text-align': 'center' }"
        size="small"
      >
        <el-table-column prop="monitorCode" label="测点编号"> </el-table-column>
        <el-table-column prop="monitorName" label="测点名称"></el-table-column>
        <el-table-column prop="hdata" label="测量值(m)"></el-table-column>
        <el-table-column prop="theDate" label="测量时间"></el-table-column>
      </el-table>
    </div>
    <!-- <div id="beachCharts" class="beach"></div> -->
  </div>
</template>

<script>
import axios from 'axios'
import { getLatestPhrlData } from '../../../api/Monitoring'
import moment from 'moment'
export default {
  name: 'SeepageLine',
  components: {},
  props: {
    node: Object
  },
  data () {
    return {
      list: [],
      realDataInterVal: null
    }
  },
  methods: {
    async getList () {
      const res = await getLatestPhrlData({ monitorCode: this.node.monitorCode, count: 17 })
      console.log(res)
      if (res.resultCode == '200') {
        this.list = res.parameter
        this.list.forEach(item => {
          item.hdata = Number(item.hdata).toFixed(3)
          // item.data = item.data.toFixed(3)
        })
      } else if (res.resultCode == '204') {
        this.list = []
      } else {
        this.$message(res.message)
      }

    }
  },
  mounted () {
    this.getList()


    
  },

  computed: {

  },
  watch: {

  }
}
</script>

<style scoped>
.beach {
  /* width: 1000px; */
  height: 50vh;
  margin-top: 20px;
  width: 100%;
  /* margin: 0 auto; */
}
.beachTable {
  height: 32vh;
  /* margin-top: 50px; */
}
.beachTable >>> .el-table tr:nth-child(odd) {
  /* background: pink; */
  text-align: center !important;
  color: #000;
  font-size: 12px;
}
.beachTable >>> .el-table tr:nth-child(even) {
  background: rgba(0, 0, 0, 0.05);
  text-align: center !important;
  color: #000;
  font-size: 12px;
}
</style>